<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <!-- 全局样式设置文件 -->
    <link rel="stylesheet" href="css/reset.min.css">
    <link rel="stylesheet" href="css/xiaomi.css">
    <link rel="stylesheet" href="https://at.alicdn.com/t/c/font_4081050_kut66121s5.css?spm=a313x.7781069.1998910419.52&file=font_4081050_kut66121s5.css">
</head>
<body>
    <header>
        <div class="warper headerCon">
            <ul>
                <li><a href="#">小米官网</a></li>
                <li><a href="#">小米商城</a></li>
                <li><a href="#">MIUI</a></li>
                <li><a href="#">loT</a></li>
                <li><a href="#">云服务</a></li>
                <li><a href="#">天星数科</a></li>
                <li><a href="#">有品</a></li>
                <li><a href="#">小爱开放平台</a></li>
                <li><a href="#">企业团购</a></li>
                <li><a href="#">资质认证</a></li>
                <li><a href="#">协议规则</a></li>
                <li><a href="#">下载app</a></li>
                <li class="last"><a href="#">Select Location</a></li>
            </ul>
            <ol>
                <li><a href="#">登录</a></li>
                <li><a href="#">注册</a></li>
                <li class="last"><a href="#">消息通知</a></li>
                <li class="last cart">
                    <a href="#">
                        <span class="iconfont icon-gouwuchekong"></span>
                        购物车(0)
                    </a>
                    <div class="cartbox">
                        购物车中还没有商品，赶紧选购吧！
                    </div>
                </li>
            </ol>
        </div>
    </header>
    <section class="sectionA">
        <div class="warper sectionACon">
            <!-- 导航 -->
            <nav>
                <img src="images/logo.png" alt="">
                <ul>
                    <li>Xiaomi手机</li>
                    <li>Redmi手机</li>
                    <li>电视</li>
                    <li>笔记本</li>
                    <li>平板</li>
                    <li>家电</li>
                    <li>路由器</li>
                    <li><a href="#">服务中心</a></li>
                    <li><a href="#">社区</a></li>
                </ul>
                <form action="">
                    <input type="text" placeholder="空调">
                    <button>
                        <span class="iconfont icon-sousuoxiao"></span>
                    </button>
                </form>
            </nav>
            <!-- 轮播图 -->
            <div class="banner">
                <!-- 左侧盒子 -->
                <ul class="leftbox">
                    <li>
                        手机
                        <span>&gt;</span>
                        <div>
                            111
                        </div>
                    </li>
                    <li>
                        电视
                        <span>&gt;</span>
                        <div>
                            222
                        </div>
                    </li>
                    <li>
                        家电
                        <span>&gt;</span>
                        <div>
                            3333
                        </div>
                    </li>
                    <li>
                        笔记本 平板
                        <span>&gt;</span>
                    </li>
                    <li>
                        出行 穿戴
                        <span>&gt;</span>
                    </li>
                    <li>
                        耳机 音响
                        <span>&gt;</span>
                    </li>
                    <li>
                        健康 儿童
                        <span>&gt;</span>
                    </li>
                    <li>
                        生活 箱包
                        <span>&gt;</span>
                    </li>
                    <li>
                        健康 儿童
                        <span>&gt;</span>
                    </li>
                    <li>
                        生活 箱包
                        <span>&gt;</span>
                    </li>
                </ul>
                <div class="lunbo">
                    <!-- 轮播图图片内容 -->
                     <div class="lunbocon">
                        <a href="#">
                            <img src="images/banner01.jpeg" alt="">
                        </a>
                     </div>
                     <!-- 小圆点 -->
                     <div class="cricle"></div>
                     <!-- 左右箭头 -->
                     <div class="prev"></div>
                     <div class="next"></div>
                </div>
            </div>
            <!-- 轮播图下面盒子 -->
            <div class="bottombox">
                <ul>
                    <li>
                        <img src="images/001.png" alt="">
                        <span>保障服务</span>
                    </li>
                    <li>
                        <img src="images/002.png" alt="">
                        <span>保障服务</span>
                    </li>
                    <li>
                        <img src="images/003.png" alt="">
                        <span>保障服务</span>
                    </li>
                    <li>
                        <img src="images/004.png" alt="">
                        <span>保障服务</span>
                    </li>
                    <li>
                        <img src="images/005.png" alt="">
                        <span>保障服务</span>
                    </li>
                    <li>
                        <img src="images/006.png" alt="">
                        <span>保障服务</span>
                    </li>
                </ul>
                <img src="images/aa.jpg" alt="">
                <img src="images/bb.jpg" alt="">
                <img src="images/cc.jpg" alt="">
            </div>
        </div>
    </section>
    <div class="warper sectionBCon">

    </div>
</body>
</html>